import { useEffect, useState } from "react";
import NavBar from "../components/NavBar";
import VideoCard from "../components/HomePage/VideoCard";

export default function HomePage() {
  const [videoIds, setVideoIds] = useState([]);
  /// mock videoId
  useEffect(() => {
    setVideoIds([1]);
  }, []);
  return (
    <>
      <NavBar />
      <div className="HomePage" data-testid="HomePage">
        {videoIds.map((videoId) => (
          <VideoCard key={`Card_${videoId}`} videoId={videoId} />
        ))}
      </div>
    </>
  );
}
